import 'package:aero_frisbee/gen/assets.gen.dart';
import 'package:aero_frisbee/pages/modues/message/pages/message/message_detail/views/af_record_view.dart';
import 'package:aero_frisbee/pages/modues/message/pages/message/message_detail/viwe_model/af_bottom_input_field_view_model.dart';
import 'package:aero_frisbee/pages/modues/message/pages/message/message_detail/viwe_model/af_record_type_state.dart';
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

class AfInputRecordIndicatorView extends ConsumerStatefulWidget {
  const AfInputRecordIndicatorView({
    super.key,
  });

  @override
  ConsumerState<ConsumerStatefulWidget> createState() =>
      _AfInputRecordIndicatorViewState();
}

class _AfInputRecordIndicatorViewState
    extends ConsumerState<AfInputRecordIndicatorView> {
  final GlobalKey _keyOfSendArea = GlobalKey();
  @override
  Widget build(BuildContext context) {
    ref.listen(recordLongPressMoveOffsetServiceProvider,
        (previousData, newData) {
      if (newData != null) {
        var move = newData;
        var box = _keyOfSendArea.currentContext?.findRenderObject();
        if (box != null && (box is RenderBox)) {
          var local = box.globalToLocal(move);
          if (box.hitTest(BoxHitTestResult(), position: local)) {
            ///取消
            ref.read(afRecordTypeStateServiceProvider.notifier).record();
          } else {
            ///取消
            ref.read(afRecordTypeStateServiceProvider.notifier).cancel();
          }
        }
      }
    });
    final isRecording = ref.watch(afRecordTypeStateServiceProvider) ==
        const AfRecordTypeState.recording();
    return Container(
      decoration: BoxDecoration(
        color: const Color(0xff000000).withOpacity(0.6),
      ),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.end,
        children: [
          if (isRecording)
            const AfRecordView()
          else
            Padding(
              padding: const EdgeInsets.symmetric(vertical: 80),
              child: Assets.images.chat.chatRecordCancel.image(width: 131),
            ),
          const SizedBox(
            height: 100,
          ),
          Text(
            isRecording ? 'Release Send' : 'Release Cancel',
            style: const TextStyle(
              color: Color(0xffFFFFFF),
              fontWeight: FontWeight.w500,
              fontSize: 16,
            ),
            textAlign: TextAlign.center,
            overflow: TextOverflow.ellipsis,
            maxLines: 1,
          ),
          const SizedBox(
            height: 32,
          ),
          AspectRatio(
            key: _keyOfSendArea,
            aspectRatio: 375 / 158,
            child: ClipPath(
              clipper: AfBottomContainerClipper(),
              child: Container(
                decoration: const BoxDecoration(
                  color: Colors.white,
                ),
                child: Column(
                  children: [
                    const SizedBox(
                      height: 44,
                    ),
                    Expanded(
                      child: Container(
                        padding: const EdgeInsets.symmetric(horizontal: 10),
                        child: isRecording
                            ? Assets.images.chat.chatRecordLightState
                                .image(width: 62)
                            : Assets.images.chat.chatRecordGreyState
                                .image(width: 62),
                      ),
                    ),
                    SizedBox(
                      height: MediaQuery.of(context).padding.bottom,
                    ),
                  ],
                ),
              ),
            ),
          )
        ],
      ),
    );
  }

  @override
  void initState() {
    super.initState();
  }

  @override
  void dispose() {
    super.dispose();
  }

  @override
  void didUpdateWidget(AfInputRecordIndicatorView oldWidget) {
    super.didUpdateWidget(oldWidget);
  }

  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
  }
}

class AfBottomContainerClipper extends CustomClipper<Path> {
  @override
  Path getClip(Size size) {
    final path = Path()
      ..moveTo(0, 44)
      ..quadraticBezierTo(size.width / 2, 0, size.width, 44)
      ..lineTo(size.width, size.height)
      ..lineTo(0, size.height)
      ..close();
    return path;
  }

  @override
  bool shouldReclip(covariant CustomClipper<Path> oldClipper) {
    return true;
  }
}
